<template>
  <div class="f-columnY menu">
    <div class="f-flex1">
      <el-scrollbar style="height:100%" class="scrollbar-x">
        <el-tree 
          class="tree"
          ref="tree"
          :data="tree" 
          :props="defaultProps"
          show-checkbox>
        </el-tree>
      </el-scrollbar>
    </div>
  </div>
  
</template>

<script>
import { getSspaceTree } from '@/api/settings'
export default {
  data() {
    return {
      tree: [],
      defaultProps: {
        children: 'children',
        label: 'name',
        disabled: 'disabled'
      },
      selectData: {},
      selectNode: {},
      type: 'default',
    }
  },
  mounted() {
    getSspaceTree()
      .then(res => {
        if (res.code === 0) {
          this.tree = res.data
        } else {
          // this.$message.error(res.msg)
        }
      })
      .catch(err => {
        console.log(err)
      })
  },
  methods: {

   

  }
}
</script>

<style lang="scss" scoped>
  .menu {
    width: 300px;
    height: 100%;
    border-right: 1px solid #ebeef5;
    .tree {
      padding: 20px;
      ::v-deep .el-tree-node__content {
        height: 36px;
      }
      ::v-deep .custom-tree-node {
        width: 100%;
        i {
          padding: 0 3px;
        }
      }
    }
  }
  
</style>
